<!doctype html>
<html>
  <head>
    <meta content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0;" charset="utf-8">
    <title>Welcome to the VenuSEF</title>

    <!--          _ _ _                                                         _ _ _
              _ /       \ _                                                 _ /       \ _
          _ /               \ _                                         _ /               \ _
       _/_ _ _ _ _ _ _ _ _ _ _ _\ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ /_ _ _ _ _ _ _ _ _ _ _ _\_
      |_ _ _ _ _ _ _ _ _ _ _ _ _ _| _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ |_ _ _ _ _ _ _ _ _ _ _ _ _ _|
      |                           |                                 |                           |
      |                           |       NICE TO MEET YOU :)       |                           |
      |             DESIGNED BY SONG JUN KAI, NEWS & NETWORK DEPARTMENT OF SISU SEF             |
      |                           |            _ _ _ _ _            |                           |
      |                           |           |    |    |           |                           |
      |                           |           |   ·|·   |           |                           |
      |_ _ _ _ _ _ _ _ _ _ _ _ _ _|_ _ _ _ _ _|_ _ | _ _|_ _ _ _ _ _|_ _ _ _ _ _ _ _ _ _ _ _ _ _|
    -->

    <style>

      @font-face {
          font-family: 'font1'; 
          src: url('/fonts/font1.ttf');
      }

      body,html {
      margin:0px;
      background-color:#130b23;
      }

      iframe {
      border-width:0;
      }
      
      .swipe {
        overflow: hidden;
        visibility: hidden;
        position: relative;
        width:100%;
      }

      .swipe-wrap {
        overflow: hidden;
        position: relative;
      }

      .swipe-wrap > div {
        float:left;
        width:100%;
        position: relative;
      }

    </style>

  </head>

  <body id="body">
    <div style="height:100%;width:100%;display:flex;flex-direction:column;justify-content:space-between;align-items:center;">
      <iframe src="images/logo.svg" width="42%" style="margin-top:5%;"></iframe>
      <img src="images/h1.png" width="100%">
      <div id='mySwipe' class='swipe'>
        <div class='swipe-wrap'>
          <div>
            <img src="/images/CARD-FRONT-with-SHADOW.png" width="100%">
          </div>
          <div>
            <img src="/images/CARD-BACK-with-SHADOW.png" width="100%">
          </div>
        </div>
        <img src="images/arrow-left.png" height="10%" style="position:absolute;top:45%;left:7%;" onclick='mySwipe.prev()'>
        <img src="images/arrow-right.png" height="10%" style="position:absolute;top:45%;right:7%;" onclick='mySwipe.next()'>
      </div>
		  <div style="width:100%;text-align:center;">
        <img src="/images/button1.png" width="30%" onclick="location.href='activate.html'">
      </div>
		  <div style="text-align:center;font-size:30px;color:grey;margin-bottom:5%;font-family:font1;">
        ©School of Economics and Finance, SISU<br/>Just For Entertainment
      </div>
	  </div>

    <script src='swipe.js'></script>

    <script>
      // pure JS
      var elem = document.getElementById('mySwipe');
      window.mySwipe = Swipe(elem, {
        // startSlide: 4,
        // auto: 3000,
        // continuous: true,
        // disableScroll: true,
        // stopPropagation: true,
        // callback: function(index, element) {},
        // transitionEnd: function(index, element) {}
      });

      // with jQuery
      // window.mySwipe = $('#mySwipe').Swipe().data('Swipe')
    </script>

    <script>
      var body = document.getElementById("body");
      var width = window.innerWidth;
      var height = window.innerHeight;
      console.log("height: " + height + ", width: " + width)
      body.style.height = height + "px";
      body.style.width = width + "px";
    </script>

    <script>
        var _mtac = {"senseQuery":1};
        (function() {
          var mta = document.createElement("script");
          mta.src = "//pingjs.qq.com/h5/stats.js?v2.0.4";
          mta.setAttribute("name", "MTAH5");
          mta.setAttribute("sid", "500699551");

          var s = document.getElementsByTagName("script")[0];
          s.parentNode.insertBefore(mta, s);
        })();
    </script>

  </body>

</html>